<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
	<head>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>个人资料</title>
		<link rel="stylesheet" href="${BASE_PATH}/static/app/css/base.css" />
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/app/css/header.css"/>
		<link rel="stylesheet" href="${BASE_PATH}/static/app/css/public.css" />
		<link rel="stylesheet" href="${BASE_PATH}/static/app/css/personInfo-sj.css" />
		<link rel="stylesheet" type="text/css" href="${BASE_PATH}/static/app/css/my.css" />
		<style type="text/css">
			.bodys{
				margin-top:160px;
			}
			.adds{
				overflow: hidden;
				display:block;
				width: 100px;
				text-overflow: ellipsis; 
       			-o-text-overflow: ellipsis;
       			white-space:nowrap;
       		    width: 150px;
			}
		</style>
	</head>
	<body>
		<div class="user">
			<span class="back" onclick="javascript:history.go(-1);"></span>
			<div class="userheard2">
				<img src="${BASE_PATH}/static/app/img/huangguan.png" alt="" class="avator"/>
			</div>
			<div class="userheard">
				<img src="${userInfo.headimgurl}" alt="" class="avator"/>
			</div>
		</div>
		<div class="bodys">
			<div class="password">
				<span>昵称：</span>
				<span class="fR go"></span>
				<span class="fR">${userInfo.nickname}</span>
			</div>
			<div class="password">
				<span>姓名：</span>
				<span class="fR go"></span>
				<span class="fR">${userInfo.name}</span>
			</div>
			<div class="telphone">
				<span>电话：</span>
				<span class="fR go"></span>
				<span class="fR">${userInfo.phone}</span>
			</div>
			<div class="sex">
				<span>性别：</span>
				<span class="fR go"></span>
				<c:if test="${userInfo.sex == 1}">
					<span class="fR sex-info">先生</span>
				</c:if>
				<c:if test="${userInfo.sex == 2}">
					<span class="fR sex-info">女士</span>
				</c:if>
			</div>
			<div class="password">
				<span>妈咪生日：</span>
				<span class="fR go"></span>
				<span class="fR">${userInfo.birthday}</span>
			</div>
			<div class="password">
				<span>状态：</span>
				<span class="fR go"></span>
				<c:if test="${userInfo.state == 1}">
					<span class="fR">备孕</span>
				</c:if>
				<c:if test="${userInfo.state == 2}">
					<span class="fR">孕中</span>
				</c:if>
				<c:if test="${userInfo.state == 3}">
					<span class="fR">已生产</span>
				</c:if>
			</div> 
			<c:if test="${userInfo.state == 1}">
				</c:if>
				<c:if test="${userInfo.state == 2}">
					<div class="password">
						<span>预产期:</span>
						<span class="fR go"></span>
						<span class="fR">${userInfo.babythday}</span>
					</div> 
					<div class="password">
						<span>胎次:</span>
						<span class="fR go"></span>
						<c:if test="${userInfo.taici==1}">
							<span class="fR">头胎</span>
						</c:if>
						<c:if test="${userInfo.taici==2}">
							<span class="fR">二胎</span>
						</c:if>
						<c:if test="${userInfo.taici==3}">
							<span class="fR">多胎</span>
						</c:if>
					</div>  
				</c:if>
				<c:if test="${userInfo.state == 3}">
					<div class="password">
						<span>宝宝生日：</span>
						<span class="fR go"></span>
						<span class="fR">${userInfo.babythday}</span>
					</div>
					<div class="password">
						<span>胎次:</span>
						<span class="fR go"></span>
						<c:if test="${userInfo.taici==1}">
							<span class="fR">头胎</span>
						</c:if>
						<c:if test="${userInfo.taici==2}">
							<span class="fR">二胎</span>
						</c:if>
						<c:if test="${userInfo.taici==3}">
							<span class="fR">多胎</span>
						</c:if>
					</div>  
				</c:if>
			
				<div class="password">
					<span>所在区域：</span>
					<span class="fR go"></span>
					<span class="fR adds">${userInfo.address}</span>
				</div> 
			</div>
	</body>
	
<script type="text/javascript" src="${BASE_PATH}/static/lib/jquery/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
	$('.sex').click(function(){
		$('.shandow').show();
		$('.alert').show();
	})
	$('.shandow').click(function(){
		$('.shandow').hide();
		$('.alert').hide();
	})
	$('.alert').on('click','div',function(){
		$('.shandow').hide();
		$('.alert').hide();
		$('.sex-info').text($(this).text())
	})
</script>
</html>
